<div ng-controller="Camel.EndpointController">
  <form class="form-horizontal">
    <div class="control-group">
      <label class="control-label" for="componentName">Component</label>

      <div class="controls">
        <select id="componentName" ng-model="selectedComponentName"
                ng-options="componentName for componentName in componentNames"></select>
      </div>
    </div>
    <div ng-show="selectedComponentName">
      <div class="control-group">
        <label class="control-label" for="endpointPath">Endpoint</label>

        <div class="controls">
          <input id="endpointPath" class="span10" type="text" ng-model="endpointPath" placeholder="name"
                 typeahead="title for title in endpointCompletions($viewValue) | filter:$viewValue" typeahead-editable='true'
                 min-length="1">
        </div>
      </div>

      <div simple-form name="formEditor" entity='endpointParameters' data='endpointSchema' schema="schema"></div>

      <div class="control-group">
        <div class="controls">
          <button type="submit" class="btn btn-info" ng-click="createEndpointFromData()"
                  ng-disabled="!endpointPath || !selectedComponentName">
            Create endpoint from data
          </button>
        </div>
      </div>
    </div>
  </form>
</div>
